* {padding: 0;margin: 0;font-weight: bold;font-family: arial, Arial, "sans-serif";}
html,body,.bg,main {width:100%; height: 100%; overflow: hidden; }
main {
    padding: 0 .2rem;
    box-sizing: border-box;
}
 
// main
main {
    position: absolute;
    left:0;
    top:0;
    z-index: 2;

    flex:1;
    display: flex;
    justify-content: space-between;
    // background-color: red;

    .column {
        width: 25%;
        height: 100%;
        // background-color:blue;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        
        // .column:nth-of-type(2)
        &:nth-of-type(2) {
            width: 75%;
            height: 100%;
            margin: 0 .2rem; 
            // background-color: blue;
        }

        // box
        .box {
            width: 100%;
            // background: rgba(0,0,0,.8);
            // margin-bottom: .15rem;   111111

            // echarts-title
            .echarts-title {
                width: 100%;
                color: rgb(255, 255, 255);
                font-size: .25rem;
                display: flex;
                align-items: center;
                
                .iconfont {
                    width: .25rem;
                    height: .25rem;
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                    background-color: initial;
                    border-radius: 0px;
                    cursor: pointer;
                    margin-right: .2rem;
                }
                .icon1 {
                    display: inline-block;
                    background-image: url(../imgs/icon1.png);
                }
                .icon2 {
                    display: inline-block;
                    background-image: url(../imgs/icon2.png);
                }
                .icon3 {
                    display: inline-block;
                    background-image: url(../imgs/icon3.png);
                }
                .icon4 {
                    display: inline-block;
                    background-image: url(../imgs/icon4.png);
                }
                .icon5 {
                    display: inline-block;
                    background-image: url(../imgs/icon5.png);
                }
            }
            
            // content
            .echarts-content {
                width: 100%;
                height: 90%;
                background-color: red;
            }
        }

        // box-m1
        .box-m1 {
            display: flex;
            justify-content: center;
            // align-items: center;
            overflow: hidden;

            .title {
                // width: 100%;
                height: 100%;
                color: #fff;
                font-size: .78rem;
                margin-top: .4rem;
            }

            .line {
                width: 1rem;
                height: .24rem;
                margin: 0 .3rem;
                pointer-events: auto;
                image-rendering: -webkit-optimize-contrast;
                -webkit-mask-repeat: no-repeat;
                -webkit-mask-size: 100% 100%;
                -webkit-mask-image: url(../imgs/line.svg);
                background: rgb(255, 255, 255);
                border-radius: 0px;
                padding-top: 2rem;
                cursor: pointer;
            }
        }

        // box-m2
        .box-m2 {
            display: flex;
            flex-direction: column;
            align-items: center;
            color: #fff;
            .date {
                font-size: .25rem;
                margin-top: -.05rem;
            }
            .money-desc {
                font-size: .2rem;
                margin-top: .4rem;
                margin-bottom: .05rem;
            }
            .money {
                font-size: 1.6rem;
            }
            .num {
                border-radius: .2rem;
                padding: .1rem .2rem;
                background-color: #F27A24;
            }
        }

        // box-r1
        .box-r1 {
            .pc-r1-box {
                position: relative;
                .pc-r1 {
                    width: 65%;
                    height: 100%; 
                }
                .pc-r1-content {
                    position: absolute;
                    top: .6rem;
                    right: .2rem;
                    // background-color: red;
                    p.title {color:#fff;font-size:.15rem;margin-bottom: .1rem;}
                    p.num {color:#fff;font-size:.35rem;color:#FF6A00; margin-bottom: .2rem;}
                }
            }
        }

        // box-r2
        .box-r2 {
            width: 100%;
            height: 100%;
            overflow: hidden;
            ul {
                li {
                    list-style: none;
                    width: 100%;
                    color: #ff6e1b;
                    padding: .12rem 0;
                    font-size: .2rem;
                    font-weight: normal;
                    text-align: center;
                    span {
                        color: #fff;
                        font-size: .1rem;
                        padding: .04rem .12rem;
                        border-radius: .3rem;
                        background-color: red;
                        font-weight: normal;
                    }
                    span.green {background-color:green}
                }
            }
        }
    }
}